<template>
  <div class="app-container">
      <el-form style="width: 600px;">
        <el-form ref="dataForm" label-position="left" label-width="150px" style="width: 400px; margin-left:50px;">
          <el-form-item v-for="(item,i) in uiList" :key="i"  :label="item.name" :prop="item.id">
            <el-input
              v-if="item.type.name=='string'"
              v-model="form[item.id]"
              size="small"
              style="width: 200px; "
              class="filter-item"
              clearable
              :disabled="!item.isWritable"
            />
            <el-date-picker
              v-else-if="item.type.name=='date'"
              v-model="form[item.id]"
              type="date"
              value-format="yyyy-MM-dd"
              align="left"
              unlink-panels
              size="small"
              class="filter-item"
              :disabled="!item.isWritable"
            />
          </el-form-item>
        </el-form>

      </el-form>
  </div>
</template>

<script>
import {queryTaskFormProperties, completeTask} from './api/tmpt'

export default {
    name: 'TmptForm',
    components: {},
    props: {
        taskId: String
    },
    data() {
        return {
            form:{},
            uiList:[],
        }
    },
    computed: {
    },
    watch:{
        'taskId': {
            immediate: true, // vue首次赋值不触发watch的解决方法
            handler: function(taskIdNew){
                this.initUI()
            }
        }
    },
    methods: {
        initUI() {
            queryTaskFormProperties(this.taskId).then(r => {
                console.log(r)
                this.uiList = r.list
                r.list.forEach(item => {
                    this.form[item.id] = item.value
                })

            })
        },
        handleVerifyPass() {
          const task = {}
          task.id = this.taskId
          task.approve = true
          //可以加变量
          //task.formData = {}
          completeTask(task).then(r => {
            this.notify(r)
            if (r.success) {
              this.list()
            }
          })
        },
        handleVerifyFail() {
          const task = {}
          task.id = this.taskId
          task.approve = false
          //可以加变量
          //task.formData = {}
          completeTask(task).then(r => {
            this.notify(r)
            if (r.success) {
              this.list()
            }
          })
        }
    }
}
</script>
